<template>

    <vue-table  :data-source="tableList">
        <template slot="header">
            <tr>
                <th>学生姓名</th>
                <th>职业资格证书名称</th>
                <th>证书等级</th>
                <th>考取时段</th>
                <th>附件</th>
                <!--<th>操作</th>-->
            </tr>
        </template>
        <template slot="tbody" slot-scope="props">
            <tr>
                <td>{{props.item.user.u_name}}</td>
                <td>{{props.item.name}}</td>
                <td>{{props.item.grade}}</td>
                <td>{{props.item.is_college}}</td>
                <th><img v-if="props.item.path" :src="'/'+props.item.path" width="100px" height="60px"></th>
                <!--<td class="col-lg-2">-->
                    <!--<button title="查看" class="btn btn-white btn-xs m-b-none"-->
                            <!--v-on:click="showEditDialog(props.item.id)">-->
                        <!--<i class="fa fa-pencil list-btn-i"></i> 编辑-->
                    <!--</button>-->
                <!--</td>-->

            </tr>
        </template>
    </vue-table>
</template>

<script>
  export default {
    props: {
      stateManager: {
        type: Object
      }
    },
    data: function () {
      return {
        list: this.$listDataSource({
          url: 'api/professional'
        })
      };
    },
    methods: {
      showEditDialog: function (uuid) {
        console.log(uuid);
        this.stateManager.editModelId = uuid;
        this.stateManager.editDialogVisible = true;

      },
      showDeleteDialog: function (uuid) {
        this.stateManager.deleteDialogVisible = true;
        this.stateManager.deleteModelId = uuid;
      }
    },
    computed: {
      user(){
        return this.$store.state.user;
      },

      tableList(){
        if (this.stateManager.refreshList) {
          this.list.fetch();
          this.stateManager.refreshList = false;
        }
        return this.list;
      }
    }
  }
</script>
